<template>
  <div>
    {{ count }}
    <hr />
    <button @click="addone">count++</button>
    <button @click="addone2">count++22222</button>
  </div>
</template>

<script setup>
import { storeToRefs } from 'pinia'

import useCounterStore from '../../stores/counter.js'

const counterStore = useCounterStore()
// 从对象中解构对象的属性
// 【注意】
// 被解构出的属性是响应是变量
// 只能解构属性
const { count } = storeToRefs(counterStore)

const addone = () => {
  counterStore.increment()
}

const addone2 = () => {
  count.value++
}
</script>

<style scoped lang="js"></style>
